
<template>
  <el-button v-bind="btnProps" :title="title" v-on="$listeners">
    {{label}}
    <slot></slot>
  </el-button>
</template>

<script>
import { getBtnInfo } from "./config";  

/**
 * 通用按钮
 * 统一管理
 */
export default {
  name: "Button",
  data() {
    return {
      label: "",
      title: ""
    };
  },
  props: {
    name: {
      type: String,
      default: "default"
    }, 
  },
  computed: {
    btnProps() {
      const btnProps = {};
      const configBtn = getBtnInfo(this.name);

      Object.assign(btnProps,configBtn,this.$attrs);
      
      // this.$t()
      // 进行国际化
      if(btnProps.locale){ 
        btnProps.localeName = this.$t(btnProps.locale);
      }

      // 外界传入的label优先级高
      if(this.$attrs.label){
        this.label = this.$attrs.label;
      }else {
        this.label = btnProps.localeName || btnProps.label || btnProps.name;
      }

      this.title = btnProps.title || this.label;
      if (btnProps.name) {
        delete btnProps.name;
      }
      return btnProps;
    }
  },
  methods:{ 
  }
};
</script>

<style lang="scss" scoped>
</style>
